@mixin respond($media) {
  @if $media == sm {
    @media (max-width: 576px) {
      @content;
    }
  }
  @else if $media == md {
    @media (max-width: 768px) {
      @content;
    }
  }
  @else if $media == lg {
    @media (max-width: 992px) {
      @content;
    }
  }
  @else if $media == xl {
    @media (max-width: 1200px) {
      @content;
    }
  }
  @else {
    @content;
  }
}

@mixin respond-gt($px) {
  @media (min-width: $px) {
    @content;
  }
}
